<!DOCTYPE html>
<html lang="en" amp-version="1912201827130" class="i-amphtml-singledoc i-amphtml-standalone"
      style="padding-top: 0px !important; cursor: pointer;">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <style amp-runtime="">
        html {
            overflow-x: hidden !important
        }

        html.i-amphtml-fie {
            height: 100% !important;
            width: 100% !important
        }

        html:not([amp4ads]), html:not([amp4ads]) body {
            height: auto !important
        }

        html:not([amp4ads]) body {
            margin: 0 !important
        }

        body {
            -webkit-text-size-adjust: 100%;
            -moz-text-size-adjust: 100%;
            -ms-text-size-adjust: 100%;
            text-size-adjust: 100%
        }

        html.i-amphtml-singledoc.i-amphtml-embedded {
            -ms-touch-action: pan-y;
            touch-action: pan-y
        }

        html.i-amphtml-fie > body, html.i-amphtml-singledoc > body {
            overflow: visible !important
        }

        html.i-amphtml-fie:not(.i-amphtml-inabox) > body, html.i-amphtml-singledoc:not(.i-amphtml-inabox) > body {
            position: relative !important
        }

        html.i-amphtml-webview > body {
            overflow-x: hidden !important;
            overflow-y: visible !important;
            min-height: 100vh !important
        }

        html.i-amphtml-ios-embed-legacy > body {
            overflow-x: hidden !important;
            overflow-y: auto !important;
            position: absolute !important
        }

        html.i-amphtml-ios-embed {
            overflow-y: auto !important;
            position: static
        }

        #i-amphtml-wrapper {
            overflow-x: hidden !important;
            overflow-y: auto !important;
            position: absolute !important;
            top: 0 !important;
            left: 0 !important;
            right: 0 !important;
            bottom: 0 !important;
            margin: 0 !important;
            display: block !important
        }

        html.i-amphtml-ios-embed.i-amphtml-ios-overscroll, html.i-amphtml-ios-embed.i-amphtml-ios-overscroll > #i-amphtml-wrapper {
            -webkit-overflow-scrolling: touch !important
        }

        #i-amphtml-wrapper > body {
            position: relative !important;
            border-top: 1px solid transparent !important
        }

        #i-amphtml-wrapper + body {
            visibility: visible
        }

        #i-amphtml-wrapper + body .i-amphtml-lightbox-element, #i-amphtml-wrapper + body[i-amphtml-lightbox] {
            visibility: hidden
        }

        #i-amphtml-wrapper + body[i-amphtml-lightbox] .i-amphtml-lightbox-element {
            visibility: visible
        }

        #i-amphtml-wrapper.i-amphtml-scroll-disabled, .i-amphtml-scroll-disabled {
            overflow-x: hidden !important;
            overflow-y: hidden !important
        }

        amp-instagram {
            padding: 54px 0px 0px !important;
            background-color: #fff
        }

        amp-iframe iframe {
            box-sizing: border-box !important
        }

        [amp-access][amp-access-hide] {
            display: none
        }

        [subscriptions-dialog], body:not(.i-amphtml-subs-ready) [subscriptions-action], body:not(.i-amphtml-subs-ready) [subscriptions-section] {
            display: none !important
        }

        amp-experiment, amp-live-list > [update], amp-share-tracking {
            display: none
        }

        .i-amphtml-jank-meter {
            position: fixed;
            background-color: rgba(232, 72, 95, 0.5);
            bottom: 0;
            right: 0;
            color: #fff;
            font-size: 16px;
            z-index: 1000;
            padding: 5px
        }

        amp-list[resizable-children] > .i-amphtml-loading-container.amp-hidden {
            display: none !important
        }

        amp-list[load-more] [load-more-button], amp-list[load-more] [load-more-end], amp-list[load-more] [load-more-failed], amp-list[load-more] [load-more-loading] {
            display: none
        }

        amp-story-page, amp-story[standalone] {
            min-height: 1px !important;
            display: block !important;
            height: 100% !important;
            margin: 0 !important;
            padding: 0 !important;
            overflow: hidden !important;
            width: 100% !important
        }

        amp-story[standalone] {
            background-color: #202125 !important;
            position: relative !important
        }

        amp-story-page {
            background-color: #757575
        }

        amp-story .amp-active > div {
            display: none !important
        }

        amp-story-page:not(:first-of-type):not([distance]):not([active]) {
            transform: translateY(1000vh) !important
        }

        amp-autocomplete {
            position: relative !important;
            display: inline-block !important
        }

        amp-autocomplete > input, amp-autocomplete > textarea {
            padding: 0.5rem;
            border: 1px solid rgba(0, 0, 0, 0.33)
        }

        .i-amphtml-autocomplete-results, amp-autocomplete > input, amp-autocomplete > textarea {
            font-size: 1rem;
            line-height: 1.5rem
        }

        [amp-fx^=fly-in] {
            visibility: hidden
        }

        /*# sourceURL=/css/ampdoc.css*/
        [hidden] {
            display: none !important
        }

        .i-amphtml-element {
            display: inline-block
        }

        .i-amphtml-blurry-placeholder {
            transition: opacity 0.3s cubic-bezier(0.0, 0.0, 0.2, 1) !important
        }

        [layout=nodisplay]:not(.i-amphtml-element) {
            display: none !important
        }

        .i-amphtml-layout-fixed, [layout=fixed][width][height]:not(.i-amphtml-layout-fixed) {
            display: inline-block;
            position: relative
        }

        .i-amphtml-layout-responsive, [layout=responsive][width][height]:not(.i-amphtml-layout-responsive), [width][height][sizes]:not(.i-amphtml-layout-responsive) {
            display: block;
            position: relative
        }

        .i-amphtml-layout-intrinsic {
            display: inline-block;
            position: relative;
            max-width: 100%
        }

        .i-amphtml-intrinsic-sizer {
            max-width: 100%;
            display: block !important
        }

        .i-amphtml-layout-container, .i-amphtml-layout-fixed-height, [layout=container], [layout=fixed-height][height] {
            display: block;
            position: relative
        }

        .i-amphtml-layout-fill, [layout=fill]:not(.i-amphtml-layout-fill) {
            display: block;
            overflow: hidden !important;
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0
        }

        .i-amphtml-layout-flex-item, [layout=flex-item]:not(.i-amphtml-layout-flex-item) {
            display: block;
            position: relative;
            -ms-flex: 1 1 auto;
            flex: 1 1 auto
        }

        .i-amphtml-layout-fluid {
            position: relative
        }

        .i-amphtml-layout-size-defined {
            overflow: hidden !important
        }

        .i-amphtml-layout-awaiting-size {
            position: absolute !important;
            top: auto !important;
            bottom: auto !important
        }

        i-amphtml-sizer {
            display: block !important
        }

        .i-amphtml-blurry-placeholder, .i-amphtml-fill-content {
            display: block;
            height: 0;
            max-height: 100%;
            max-width: 100%;
            min-height: 100%;
            min-width: 100%;
            width: 0;
            margin: auto
        }

        .i-amphtml-layout-size-defined .i-amphtml-fill-content {
            position: absolute;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0
        }

        .i-amphtml-layout-intrinsic .i-amphtml-sizer {
            max-width: 100%
        }

        .i-amphtml-replaced-content, .i-amphtml-screen-reader {
            padding: 0 !important;
            border: none !important
        }

        .i-amphtml-screen-reader {
            position: fixed !important;
            top: 0px !important;
            left: 0px !important;
            width: 4px !important;
            height: 4px !important;
            opacity: 0 !important;
            overflow: hidden !important;
            margin: 0 !important;
            display: block !important;
            visibility: visible !important
        }

        .i-amphtml-screen-reader ~ .i-amphtml-screen-reader {
            left: 8px !important
        }

        .i-amphtml-screen-reader ~ .i-amphtml-screen-reader ~ .i-amphtml-screen-reader {
            left: 12px !important
        }

        .i-amphtml-screen-reader ~ .i-amphtml-screen-reader ~ .i-amphtml-screen-reader ~ .i-amphtml-screen-reader {
            left: 16px !important
        }

        .i-amphtml-unresolved {
            position: relative;
            overflow: hidden !important
        }

        .i-amphtml-select-disabled {
            -webkit-user-select: none !important;
            -moz-user-select: none !important;
            -ms-user-select: none !important;
            user-select: none !important
        }

        .i-amphtml-notbuilt, [layout]:not(.i-amphtml-element) {
            position: relative;
            overflow: hidden !important;
            color: transparent !important
        }

        .i-amphtml-notbuilt:not(.i-amphtml-layout-container) > *, [layout]:not([layout=container]):not(.i-amphtml-element) > * {
            display: none
        }

        .i-amphtml-ghost {
            visibility: hidden !important
        }

        .i-amphtml-element > [placeholder], [layout]:not(.i-amphtml-element) > [placeholder] {
            display: block
        }

        .i-amphtml-element > [placeholder].amp-hidden, .i-amphtml-element > [placeholder].hidden {
            visibility: hidden
        }

        .i-amphtml-element:not(.amp-notsupported) > [fallback], .i-amphtml-layout-container > [placeholder].amp-hidden, .i-amphtml-layout-container > [placeholder].hidden {
            display: none
        }

        .i-amphtml-layout-size-defined > [fallback], .i-amphtml-layout-size-defined > [placeholder] {
            position: absolute !important;
            top: 0 !important;
            left: 0 !important;
            right: 0 !important;
            bottom: 0 !important;
            z-index: 1
        }

        .i-amphtml-notbuilt > [placeholder] {
            display: block !important
        }

        .i-amphtml-hidden-by-media-query {
            display: none !important
        }

        .i-amphtml-element-error {
            background: red !important;
            color: #fff !important;
            position: relative !important
        }

        .i-amphtml-element-error:before {
            content: attr(error-message)
        }

        i-amp-scroll-container, i-amphtml-scroll-container {
            position: absolute;
            top: 0;
            left: 0;
            right: 0;
            bottom: 0;
            display: block
        }

        i-amp-scroll-container.amp-active, i-amphtml-scroll-container.amp-active {
            overflow: auto;
            -webkit-overflow-scrolling: touch
        }

        .i-amphtml-loading-container {
            display: block !important;
            pointer-events: none;
            z-index: 1
        }

        .i-amphtml-notbuilt > .i-amphtml-loading-container {
            display: block !important
        }

        .i-amphtml-loading-container.amp-hidden {
            visibility: hidden
        }

        .i-amphtml-element > [overflow] {
            cursor: pointer;
            position: relative;
            z-index: 2;
            visibility: hidden
        }

        .i-amphtml-element > [overflow].amp-visible {
            visibility: visible
        }

        template {
            display: none !important
        }

        .amp-border-box, .amp-border-box *, .amp-border-box :after, .amp-border-box :before {
            box-sizing: border-box
        }

        amp-pixel {
            display: none !important
        }

        amp-analytics, amp-story-auto-ads {
            position: fixed !important;
            top: 0 !important;
            width: 1px !important;
            height: 1px !important;
            overflow: hidden !important;
            visibility: hidden
        }

        html.i-amphtml-fie > amp-analytics {
            position: initial !important
        }

        [visible-when-invalid]:not(.visible), amp-list [fetch-error], form [submit-error], form [submit-success], form [submitting] {
            display: none
        }

        amp-accordion {
            display: block !important
        }

        amp-accordion > section {
            float: none !important
        }

        amp-accordion > section > * {
            float: none !important;
            display: block !important;
            overflow: hidden !important;
            position: relative !important
        }

        amp-accordion, amp-accordion > section {
            margin: 0
        }

        amp-accordion > section > :last-child {
            display: none !important
        }

        amp-accordion > section[expanded] > :last-child {
            display: block !important
        }

        /*# sourceURL=/css/ampshared.css*/</style>

    <style amp-extension="amp-sidebar">
        amp-sidebar {
            --story-page-vh: 1vh;
            position: fixed !important;
            top: 0;
            max-height: 100vh !important;
            height: 100vh;
            max-width: 80vw;
            background-color: #efefef;
            min-width: 45px !important;
            outline: none;
            overflow-x: hidden !important;
            overflow-y: auto !important;
            z-index: 2147483647;
            -webkit-overflow-scrolling: touch;
            will-change: transform
        }

        amp-sidebar[side=left] {
            left: 0 !important;
            transform: translateX(-100%);
            animation-name: i-amphtml-sidebar-slide-out-left
        }

        amp-sidebar[side=left][open] {
            animation-name: i-amphtml-sidebar-slide-in-left
        }

        amp-sidebar[side=right] {
            right: 0 !important;
            transform: translateX(100%);
            animation-name: i-amphtml-sidebar-slide-out-right
        }

        amp-sidebar[side=right][open] {
            animation-name: i-amphtml-sidebar-slide-in-right
        }

        amp-sidebar[side][i-amphtml-sidebar-opened] {
            transform: none;
            animation: none
        }


        @keyframes i-amphtml-sidebar-slide-in-left {
            0% {
                transform: translateX(-100%)
            }
            to {
                transform: translateX(0)
            }
        }

        @keyframes i-amphtml-sidebar-slide-out-left {
            0% {
                transform: translateX(0)
            }
            to {
                transform: translateX(-100%)
            }
        }

        @keyframes i-amphtml-sidebar-slide-in-right {
            0% {
                transform: translateX(100%)
            }
            to {
                transform: translateX(0)
            }
        }

        @keyframes i-amphtml-sidebar-slide-out-right {
            0% {
                transform: translateX(0)
            }
            to {
                transform: translateX(100%)
            }
        }

        </style>
    <style amp-extension="amp-carousel">
        .amp-carousel-slide > .i-amphtml-replaced-content {
            -o-object-fit: contain;
            object-fit: contain
        }

        .amp-carousel-button {
            position: absolute;
            box-sizing: border-box;
            top: 50%;
            height: 34px;
            width: 34px;
            border-radius: 2px;
            opacity: 0;
            pointer-events: all;
            background-color: rgba(0, 0, 0, 0.5);
            background-position: 50% 50%;
            background-repeat: no-repeat;
            transform: translateY(-50%);
            visibility: hidden;
            z-index: 10
        }

        .amp-mode-mouse .amp-carousel-button, amp-carousel[controls] .amp-carousel-button {
            opacity: 1;
            visibility: visible
        }

        .amp-carousel-button-prev {
            left: 16px;
            background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='%23fff'%3E%3Cpath d='M15 8.25H5.87l4.19-4.19L9 3 3 9l6 6 1.06-1.06-4.19-4.19H15v-1.5z'/%3E%3C/svg%3E");
            background-size: 18px 18px
        }

        .amp-carousel-button-next {
            right: 16px;
            background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='%23fff'%3E%3Cpath d='M9 3L7.94 4.06l4.19 4.19H3v1.5h9.13l-4.19 4.19L9 15l6-6z'/%3E%3C/svg%3E");
            background-size: 18px 18px
        }

        .i-amphtml-carousel-button-start-hint .amp-carousel-button:not(.amp-disabled) {
            animation: i-amphtml-carousel-hint 1s ease-in 3s 1 normal both
        }

        .amp-mode-mouse .i-amphtml-carousel-button-start-hint .amp-carousel-button:not(.amp-disabled) {
            animation: none
        }

        @keyframes i-amphtml-carousel-hint {
            0% {
                opacity: 1;
                visibility: visible
            }
            to {
                opacity: 0;
                visibility: hidden
            }
        }

        amp-carousel .amp-carousel-button.amp-disabled {
            animation: none;
            opacity: 0;
            visibility: hidden
        }

        .i-amphtml-slides-container {
            display: -ms-flexbox !important;
            display: flex !important;
            -ms-flex-wrap: nowrap;
            flex-wrap: nowrap;
            height: 100% !important;
            left: 0;
            overflow-x: auto !important;
            overflow-y: hidden !important;
            position: absolute !important;
            top: 0;
            width: 100% !important;
            scroll-snap-type: x mandatory !important;
            scrollbar-width: none;
            padding-bottom: 20px !important;
            box-sizing: content-box !important;
            -webkit-overflow-scrolling: touch !important
        }

        .i-amphtml-slides-container::-webkit-scrollbar {
            display: none !important
        }

        .i-amphtml-slides-container.i-amphtml-no-scroll {
            overflow-x: hidden !important
        }

        .i-amphtml-slide-item {
            -ms-flex-align: center !important;
            align-items: center !important;
            display: none !important;
            -ms-flex: 0 0 100% !important;
            flex: 0 0 100% !important;
            height: 100% !important;
            -ms-flex-pack: center !important;
            justify-content: center !important;
            position: relative !important;
            scroll-snap-align: start !important;
            width: 100% !important
        }

        .i-amphtml-slide-item > * {
            height: 100%;
            width: 100%;
            overflow: hidden !important
        }

        .i-amphtml-slide-item-show {
            display: -ms-flexbox !important;
            display: flex !important
        }

        .i-amphtml-carousel-end-marker, .i-amphtml-carousel-start-marker {
            background-color: transparent !important;
            display: block !important;
            -ms-flex: 0 0 1px !important;
            flex: 0 0 1px !important;
            height: 100% !important;
            position: relative !important;
            scroll-snap-align: start !important;
            width: 1px !important
        }

        .i-amphtml-carousel-start-marker {
            -ms-flex-order: -1 !important;
            order: -1 !important;
            margin-left: -1px !important
        }

        .i-amphtml-carousel-end-marker {
            -ms-flex-order: 100000000 !important;
            order: 100000000 !important;
            margin-right: -1px !important
        }

        .i-amphtml-slidescroll-no-snap.i-amphtml-slides-container {
            scroll-snap-type: none !important
        }

        .i-amphtml-slidescroll-no-snap .i-amphtml-slide-item {
            scroll-snap-align: none !important
        }

        .i-amphtml-slidescroll-no-snap.i-amphtml-slides-container.i-amphtml-no-scroll {
            -webkit-overflow-scrolling: auto !important
        }

        .amp-scrollable-carousel-slide {
            display: inline-block !important;
            margin-left: 8px
        }

        .amp-scrollable-carousel-slide:first-child {
            margin-left: 0px
        }

        .i-amphtml-scrollable-carousel-container {
            white-space: nowrap !important;
            overflow-x: auto !important;
            overflow-y: hidden !important;
            -webkit-overflow-scrolling: touch !important
        }

        </style>
    <style amp-extension="amp-form">
        form.amp-form-submit-error [submit-error], form.amp-form-submit-success [submit-success], form.amp-form-submitting [submitting] {
            display: block
        }

        textarea[autoexpand]:not(.i-amphtml-textarea-max) {
            overflow: hidden !important
        }

        .i-amphtml-textarea-clone {
            visibility: hidden;
            position: absolute;
            top: -9999px;
            left: -9999px;
            height: 0 !important
        }

        .i-amphtml-validation-bubble {
            transform: translate(-50%, -100%);
            background-color: #fff;
            box-shadow: 0 5px 15px 0 rgba(0, 0, 0, 0.5);
            max-width: 200px;
            position: absolute;
            display: block;
            box-sizing: border-box;
            padding: 10px;
            border-radius: 5px
        }

        .i-amphtml-validation-bubble:after {
            content: " ";
            position: absolute;
            bottom: -8px;
            left: 30px;
            width: 0;
            height: 0;
            border-left: 8px solid transparent;
            border-right: 8px solid transparent;
            border-top: 8px solid #fff
        }

        [visible-when-invalid] {
            color: red
        }
        </style>

    <meta name="msvalidate.01" content="35989B73C210758B4BDF9D542505B7E8">
    <meta name="google-site-verification" content="O-yyHn1YeTPhlZq3GULZ8yVh2WxoZ4i0-A3kdmcR1FU">
    <script async="" src="/js/v0.js"></script>
    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
    <style amp-boilerplate="">
        body {
            -webkit-animation: -amp-start 8s steps(1, end) 0s 1 normal both;
            -moz-animation: -amp-start 8s steps(1, end) 0s 1 normal both;
            -ms-animation: -amp-start 8s steps(1, end) 0s 1 normal both;
            animation: -amp-start 8s steps(1, end) 0s 1 normal both
        }

        @-webkit-keyframes -amp-start {
            from {
                visibility: hidden
            }
            to {
                visibility: visible
            }
        }

        @-moz-keyframes -amp-start {
            from {
                visibility: hidden
            }
            to {
                visibility: visible
            }
        }

        @-ms-keyframes -amp-start {
            from {
                visibility: hidden
            }
            to {
                visibility: visible
            }
        }

        @-o-keyframes -amp-start {
            from {
                visibility: hidden
            }
            to {
                visibility: visible
            }
        }

        @keyframes -amp-start {
            from {
                visibility: hidden
            }
            to {
                visibility: visible
            }
        }</style>
    <noscript>
        <style amp-boilerplate>
            body {
                -webkit-animation: none;
                -moz-animation: none;
                -ms-animation: none;
                animation: none
            }</style>
    </noscript>
    <title>@yield('title')</title>
    <meta name="robots" content="index">
    <!-- Sidebar -->
    <!-- https://ampbyexample.com/components/amp-sidebar -->
    <script async="" custom-element="amp-sidebar" src="/js/amp-sidebar-0.1.js"></script>
    <!-- /Sidebar -->
    <!-- Form -->
    <!-- https://ampbyexample.com/components/amp-form -->
    <script async="" custom-element="amp-form" src="/js/amp-form-0.1.js"></script>
    <!-- /Form -->
    <!-- Carousel -->
    <!-- https://ampbyexample.com/components/amp-carousel -->
    <script async="" custom-element="amp-carousel" src="/js/amp-carousel-0.1.js"></script>
    <!-- /Carousel -->
    <link href="/css/css.css">
    <!-- Google Analytics -->
    <!-- https://developers.google.com/analytics/devguides/collection/amp-analytics -->
    <script async="" custom-element="amp-analytics" src="/js/amp-analytics-0.1.js"></script>
    <!-- /Google Analytics -->

    <style amp-custom="">

        /*
     * =========================================================================
     * Common styles
     * =========================================================================
     */

        * {
            box-sizing: border-box;
        }

        body {
            font-family: 'Nunito Sans', sans-serif;
            font-weight: 400;
        }

        .container {
            padding: 0 15px;
        }

        /*
     * -----------------------------------------------------------------
     * Header
     * -----------------------------------------------------------------
     */

        #header {
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .header-logo {
            max-width: 80%;
            margin-top: 4px;
            margin-left: 10px;
        }

        #header-hamburger button {
            background: #fff;
            border: 0; /* To hide native border */
            border-right: 1px solid #ddd;
            border-bottom: 1px solid #ddd;
            padding: 20px;
        }

        #header-hamburger button .icon-bar {
            background: #000;
            display: block;
            height: 2px;
            width: 26px;
        }

        #header-hamburger button .icon-bar + .icon-bar {
            margin-top: 8px;
        }

        #header-brand {
            border-bottom: 1px solid #ddd;
            height: 70px;
            width: calc(100% - 75px * 2);
            display: flex;
            align-items: center;
            justify-content: center;
        }

        #header-cart {
            border: 0;
            border-bottom: 1px solid #ddd;
            display: flex;
            align-items: center;
            justify-content: center;
            height: 70px;
            width: 75px;
            position: relative;
        }

        #cart-count {
            background-color: #777;
            border-radius: 10px;
            color: #fff;
            font-size: 14px;
            font-weight: 700;
            line-height: 1;
            padding: 3px 7px;
            position: absolute;
            top: 6px;
            left: 34px;
        }

        #header-cart a {
            background: white;
            border-radius: 4px;
        }

        /*
     * -----------------------------------------------------------------
     * Breadcrumbs
     * -----------------------------------------------------------------
     */

        #breadcrumbs {
            font-size: 12px;
            padding-left: 0;
            text-transform: uppercase;
        }

        #breadcrumbs li {
            display: inline-block;
        }

        #breadcrumbs li + li:before {
            color: #ccc;
            content: '/\A0';
            padding: 0 5px;
        }

        #breadcrumbs li a {
            color: #484e52;
            text-decoration: none;
        }

        /*
     * -----------------------------------------------------------------
     * Footer
     * -----------------------------------------------------------------
     */

        .footer-title {
            color: #9b9999;
            font-size: 14px;
            text-transform: uppercase;
        }

        .footer-linklist {
            list-style: none;
            padding: 5px 0;
        }

        ul li.footer-linklist-item {
            padding-bottom: 6px;
        }

        .footer-linklist-link {
            color: #788188;
            text-decoration: none;
        }

        #footer-copyright {
            border-top: 1px solid #ddd;
            text-align: center;
        }

        #footer-copyright a {
            color: #788188;
            text-decoration: none;
        }

        #footer-payment-accepted {
            color: #788188;
        }

        /*
     * -----------------------------------------------------------------
     * Sidebar
     * -----------------------------------------------------------------
     */

        #sidebar ul {
            padding: 0 40px;
        }

        #sidebar ul li {
            font-size: 12px;
            font-weight: bold;
            padding: 10px 0;
            text-transform: uppercase;
        }

        #sidebar ul li a {
            color: #000;
            text-decoration: none;
        }

        #header-brand a {
            color: black;
            text-decoration: none;
            font-size: 1.5rem;
        }

        /*
     * =========================================================================
     * Custom styles (for specific pages)
     * =========================================================================
     */

        .home-top-image-text {
            background: -webkit-linear-gradient(#332f2f, #121111);
            -webkit-background-clip: text;
            -webkit-text-fill-color: transparent;
            text-align: center;
        }

        .text-center {
            text-align: center;
        }

        .text-right {
            text-align: right;
        }

        .text-left {
            text-align: left;
        }

        .slide {
            position: relative;
        }

        .slide .slide__caption {
            position: absolute;
            top: 56%;
            left: 50%;
            transform: translate(-50%, -50%);
            white-space: nowrap;
            color: rgb(255, 255, 255);
            letter-spacing: 0;
            font-weight: 800;
        }

        .slide .slide__caption .slide__caption-lg {
            font-size: 31px;
            line-height: 31px;
        }

        .slide .slide__caption .slide__caption-sm {
            font-size: 16px;
            line-height: 16px;
        }

        .slide .amp-img-bg img {
            width: auto;
            height: auto;
            max-width: none;
        }

        .slide .amp-img-bg--center img {
            top: 50%;
            left: 50%;
            right: auto;
            bottom: auto;
            transform: translate(-50%, -50%);
        }

        .grid {
            padding: 8px;
        }

        .grid .grid__row {
            width: 100%;
            position: relative;
        }

        .grid .grid__row::after {
            content: "";
            display: table;
            clear: both;
        }

        .grid .grid__item {
            width: 100%;
            float: left;
        }

        .product {
            position: relative;
            margin: 8px;
        }

        .product .product__link {
            outline: none;
            cursor: pointer;
            text-decoration: none;
        }

        .product .product__link--btn {
            display: block;
            padding: 10px;
            margin-bottom: 15px;
            font-size: 26px;
            font-weight: 600;
            line-height: 1.33em;
            color: #fff;
            background-color: #333;
            -webkit-transition: all 0.4s ease;
            -moz-transition: all 0.4s ease;
            transition: all 0.4s ease;
        }

        .product .product__title {
        }

        .product .product__content {
            width: 100%;
            position: absolute;
            bottom: 0;
            left: 0;
            padding: 50px;
            text-align: center;
        }

        .product .product__image {
            max-height: 360px;
        }

        @media (min-width: 768px) {
            .grid .grid__item {
                width: 50%;
            }
        }

        .amp-home-top-image {
            max-height: 450px;
        }

        .collection-card {
            margin-top: 25px;
        }

        .card {
            padding: 1em;
            border: 1px solid #e4e4e4;
            border-top: 0;
            padding-bottom: 12px;
            color: black;
        }

        .card h5 {
            padding: 0px;
            font-size: 0.98rem;
            margin: 0px;
            text-decoration: none;
        }

        .card p {
            margin: 6px 0;
            margin-bottom: 2px;
        }

        .card p a {
            text-decoration: none;
            color: black;
        }

        /*
             * -----------------------------------------------------------------
             * Popular products
             * -----------------------------------------------------------------
             */

        #popular-products-header {
            color: #484e52;
            font-family: Cuprum, sans-serif;
            text-align: center;
            margin-top: 0px;
        }

        #popular-products-box {
        }

        .products-wrapper {
            margin-top: 25px;
        }

        /*
             * -----------------------------------------------------------------
             * Categories
             * -----------------------------------------------------------------
             */

        #categories-header {
            color: #484e52;
            font-family: Cuprum, sans-serif;
            text-align: center;
        }

        .shop-now-btn-wrapper {
            text-align: center;
            margin-top: 22px;
            margin-bottom: 22px;
        }

        .shop-now-btn {
            border: none;
            background-color: #222;
            color: #fff;
            padding: 12px 28px;
            border-radius: 7px;
        }

        .top-products-wrapper {
            margin-top: 30px;
        }

        .top-products-wrapper h2 {
            text-align: center;
        }

        .top-products-wrapper .card, .collection-card .card {
            text-align: center;
        }


    </style>

    <script async="" custom-element="amp-loader" data-script="amp-loader" i-amphtml-inserted="" crossorigin="anonymous"
            src="/js/amp-loader-0.1.js"></script>
    <script async="" custom-element="amp-auto-lightbox" data-script="amp-auto-lightbox" i-amphtml-inserted=""
            crossorigin="anonymous" src="/js/amp-auto-lightbox-0.1.js"></script>
</head>
<body class="amp-mode-touch amp-mode-keyboard-active"
      style="opacity: 1; visibility: visible; animation: 0s ease 0s 1 normal none running none;">
<!--suppress HtmlUnknownTarget -->
<!--页面头部-->
<div id="header">
    <!--logo-->
    <div id="header-brand">
        <a href="/">
            <img src="{{$logo ?: '/images/logo.png'}}" class="header-logo" alt="">
        </a>
    </div>
    <!--购物车按钮-->
    <div id="header-cart">
        <a href="/cart">
            <svg id="icon-cart-empty" viewBox="0 0 30 32" width="25" height="25">
                <path class="path1"
                      d="M27.070 31.996h-24.609c-1.358 0-2.461-1.102-2.461-2.461v-19.688c0-1.358 1.103-2.461 2.461-2.461h4.922v-1.23c0-3.399 2.754-6.152 6.152-6.152h2.461c3.397 0 6.152 2.754 6.152 6.152v1.23h4.922c1.358 0 2.461 1.102 2.461 2.461v19.688c0 1.358-1.102 2.461-2.461 2.461zM19.688 6.156c0-2.039-1.653-3.691-3.691-3.691h-2.461c-2.039 0-3.691 1.653-3.691 3.691v1.23h9.844v-1.23zM27.070 11.078c0-0.68-0.551-1.23-1.23-1.23h-3.691v4.922h-2.461v-4.922h-9.844v4.922h-2.461v-4.922h-3.691c-0.679 0-1.23 0.55-1.23 1.23v17.227c0 0.68 0.551 1.23 1.23 1.23h22.148c0.679 0 1.23-0.551 1.23-1.23v-17.227z"></path>
            </svg>
        </a>
    </div>
    <!--展开菜单按钮-->
    <div id="header-hamburger">
        <button on="tap:sidebar.toggle">
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
    </div>
</div>

@yield('content')

<!--suppress HtmlUnknownTarget -->
<!--页面底部-->
<div class="container" id="footer">

    <div class="row">

        <ul class="footer-linklist">
            <li class="footer-linklist-item ">
                <a class="footer-linklist-link" href="{{url('/article/about_us')}}">About</a>
            </li>
            <li class="footer-linklist-item ">
                <a class="footer-linklist-link" href="{{url('/article/contact_us')}}">Contact Us</a>
            </li>
            <li class="footer-linklist-item ">
                <a class="footer-linklist-link" href="{{url('/article/terms')}}">Terms and
                    conditions</a>
            </li>
            <li class="footer-linklist-item ">
                <a class="footer-linklist-link" href="{{url('/article/payment')}}">Payments &amp;
                    Pricing</a>
            </li>
            <li class="footer-linklist-item ">
                <a class="footer-linklist-link" href="{{url('/article/refund')}}">Returns &amp;
                    Refunds</a>
            </li>
            <li class="footer-linklist-item ">
                <a class="footer-linklist-link" href="{{url('/article/return')}}">Returns</a>
            </li>
            <li class="footer-linklist-item ">
                <a class="footer-linklist-link" href="{{url('/article/shipping')}}">Shipping</a>
            </li>
            <li class="footer-linklist-item ">
                <a class="footer-linklist-link" href="{{url('/article/faq')}}">FAQ</a>
            </li>
            <li class="footer-linklist-item ">
                <a class="footer-linklist-link" href="{{url('/article/dmca')}}">Dmca</a>
            </li>
        </ul>

    </div>

    <div class="row" id="footer-copyright">
        <p id="footer-payment-accepted">Payments accepted: Paypal, Visa, MasterCard</p>
    </div>

</div>
<!--左侧菜单-->
<amp-sidebar id="sidebar" layout="nodisplay" side="left"
             class="i-amphtml-element i-amphtml-layout-nodisplay i-amphtml-overlay i-amphtml-scrollable" hidden=""
             i-amphtml-layout="nodisplay" role="menu" tabindex="-1">
    <ul>
        <li>
            <a href="/">Home</a>
        </li>
        <li>
            <a href="/pages/all-categories">Collections</a>
        </li>
        <li>
            <a href="{{url('/article/about_us')}}">About</a>
        </li>
        <li>
            <a href="{{url('/article/faq')}}">FAQ</a>
        </li>
        <li>
            <a href="{{url('/article/contact_us')}}">Contact</a>
        </li>
    </ul>
    <button class="i-amphtml-screen-reader" tabindex="-1">Close the sidebar</button>
</amp-sidebar>

<audio controls="controls" style="display: none;"></audio>
</body>
</html>
